<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>余额</title>
    <link rel="stylesheet" href="../css/reset.css"/>
    <link rel="stylesheet" href="../css/style.css"/>
    <script src="../js/jquery.min.js"></script>
    <script>
        $(function () {
            $('.person').hover(function () {
                $(this).find('.personlist').show();
            }, function () {
                $(this).find('.personlist').hide();
            })

            $('.fabu').hover(function () {
                $(this).find('.fabulist').show();
                $(this).addClass('fabu-0');
            }, function () {
                $(this).find('.fabulist').hide();
                $(this).removeClass('fabu-0');
            })
        })
    </script>
</head>
<body>


<!--header start-->
<div class="header">
    <div class="w">
        <a href="" class="logo dib fl">
            <img src="../images/logo.png" alt=""/>
        </a>
        <ul class="nav fl">
            <li>
                <a href="">文字</a>
            </li>
            <li>
                <a href="">电影</a>
            </li>
            <li>
                <a href="">商店</a>
            </li>
            <li>
                <a href="">招商</a>
            </li>
            <li>
                <a href="">论坛</a>
            </li>
        </ul>
        <div class="person por fr">
            <img src="../images/p.png" alt=""/>
            <div class="personlist hz-hid">
                <a href="" class="a-0">个人中心</a>
                <a href="" class="a-1">我的上传</a>
                <a href="" class="a-2">我的收藏</a>
                <a href="" class="a-3">账号设置</a>
                <a href="" class="a-4">退出</a>
            </div>
        </div>
        <div class="fabu  por fr">
            <img src="../images/fabu.png" alt=""/>
            <div class="fabulist hz-hid">
                <a href="">发布帖子</a>
                <a href="">发布文章</a>
            </div>
        </div>
        <div class="fabu  por fr">
            <img src="../images/shou.png" alt=""/>
            <div class="fabulist hz-hid">
                <a href="">我的文章</a>
                <a href="">发布帖子</a>
                <a href="">我的产品</a>
            </div>
        </div>
        <div class="fabu  por fr">
            <img src="../images/s-0.png" alt=""/>
            <div class="p-data dn">13</div>
            <div class="fabulist hz-hid">
                <a href=""><i>10</i>我的评论</a>
                <a href=""><i>10</i>我的回复</a>
                <a href=""><i>03</i>私信</a>
                <a href=""><i>10</i>活动公告</a>
            </div>
        </div>
        <div class="fabu  por fr">
            <img src="../images/car.png" alt=""/>
            <div class="fabulist hz-hid">
                <a href=""><i>10</i>购物车</a>
                <a href=""><i>10</i>未付款</a>
                <a href=""><i>03</i>活动公告</a>
            </div>
        </div>
        <div class="search fr">
            <select  class="sel">
                <option value="">电影</option>
                <option value="">文章</option>
                <option value="">商品</option>
                <option value="">论坛</option>
            </select>
            <input type="text"/>
            <a href=""></a>
        </div>
    </div>
</div>

<!--header end-->

<div class="User">
    <div class="w hz-hid">
        <div class="img por fl">
            <img src="../images/set-0.png" alt=""/>
            <i>
                <img src="../images/icon-0.png" alt=""/>
            </i>
        </div>
        <div class="center fl">
            <ul class="ul">
                <li>
                    <strong>125</strong>

                    <p>文字</p>
                </li>
                <li>
                    <strong>85</strong>

                    <p>帖子</p>
                </li>
                <li>
                    <strong>210</strong>

                    <p>收藏</p>
                </li>
                <li>
                    <strong>85</strong>

                    <p>关注</p>
                </li>
                <li>
                    <strong>210</strong>

                    <p>粉丝</p>
                </li>
                <li>
                    <strong>85</strong>

                    <p>收藏</p>
                </li>
            </ul>
            <div class="center-bottom">
                <a href="">
                    <img src="../images/set-2.png" alt=""/>
                </a>
                <a href="">
                    <img src="../images/set-3.png" alt=""/>
                </a>
                <a href="">
                    <img src="../images/set-4.png" alt=""/>
                </a>
                <span>现居地：山西 . 晋城 . 沁水</span>      <span>职业：设计师      年龄：23</span>
            </div>
        </div>
        <ul class="right fr">
            <li class="on">
                <strong>571</strong>

                <p>积分</p>
            </li>
            <li class="bor-none">
                <strong>1.482</strong>

                <p>余额</p>
            </li>
        </ul>
    </div>

</div>

<div class="User-active">
    <div class="w hz-hid">
        <h2>网站活动</h2>
        <div class="txt fl">情人节活动有礼品哦！活动日期4月份到五月份。</div>
        <div class="right">
            <a href="">上传文章</a><a href="">发帖子</a>
        </div>
    </div>

</div>


<!--container start-->
<div class="user-container w hz-hid">
    <div class="aside fl hz-hid">
        <div class="menu-0">
            <h2>个人资料</h2>
            <ul class="ul hz-hid">
                <li>帖子</li>
                <dl>
                    <dt>文章</dt>
                    <dt>海报</dt>
                    <dt>新鲜事</dt>
                </dl>

                <li>好友</li>
                <dl>
                    <dt>关注</dt>
                    <dt>粉丝</dt>
                </dl>

                <li>收藏</li>
            </ul>
        </div>
        <div class="share-0">
            <a href="">
                <img src="../images/msg-1.png" alt=""/>
            </a>
            <a href="">
                <img src="../images/msg-2.png" alt=""/>
            </a>
            <a href="">
                <img src="../images/msg-3.png" alt=""/>
            </a>
            <a href="" class="mr-0">
                <img src="../images/msg-4.png" alt=""/>
            </a>
        </div>
    </div>

    <div class="content fr hz-hid">
        <h2>
            <span class="on">积   分</span>
            <span>余  额</span>
        </h2>

        <table class="jifen-table">
            <tr class="tr">
                <td width="186">ID/时间</td>
                <td width="220">收入/支出</td>
                <td>账户余额</td>
                <td width="220">交易状态</td>
            </tr>
            <tr>
                <td class="f14">104603008 <br/><span class="td-0 f14">2016/3/1 8:50:02</span></td>
                <td class="td">收入+30.00 <br/><span class="f14">账户充值</span></td>
                <td>180.00</td>
                <td>交易完成</td>
            </tr>
            <tr>
                <td class="f14">104603008 <br/><span class="td-0 f14">2016/3/1 8:50:02</span></td>
                <td class="td">收入+30.00 <br/><span class="f14">账户充值</span></td>
                <td>180.00</td>
                <td>交易完成</td>
            </tr>
            <tr>
                <td class="f14">104603008 <br/><span class="td-0 f14">2016/3/1 8:50:02</span></td>
                <td class="td">收入+30.00 <br/><span class="f14">账户充值</span></td>
                <td>180.00</td>
                <td>交易完成</td>
            </tr>
            <tr>
                <td class="f14">104603008 <br/><span class="td-0 f14">2016/3/1 8:50:02</span></td>
                <td class="td">收入+30.00 <br/><span class="f14">账户充值</span></td>
                <td>180.00</td>
                <td>交易完成</td>
            </tr>
            <tr>
                <td class="f14">104603008 <br/><span class="td-0 f14">2016/3/1 8:50:02</span></td>
                <td class="td">收入+30.00 <br/><span class="f14">账户充值</span></td>
                <td>180.00</td>
                <td>交易完成</td>
            </tr>
            <tr>
                <td class="f14">104603008 <br/><span class="td-0 f14">2016/3/1 8:50:02</span></td>
                <td class="td">收入+30.00 <br/><span class="f14">账户充值</span></td>
                <td>180.00</td>
                <td>交易完成</td>
            </tr>
            <tr>
                <td class="f14">104603008 <br/><span class="td-0 f14">2016/3/1 8:50:02</span></td>
                <td class="td">收入+30.00 <br/><span class="f14">账户充值</span></td>
                <td>180.00</td>
                <td>交易完成</td>
            </tr>
            <tr>
                <td class="f14">104603008 <br/><span class="td-0 f14">2016/3/1 8:50:02</span></td>
                <td class="td">收入+30.00 <br/><span class="f14">账户充值</span></td>
                <td>180.00</td>
                <td>交易完成</td>
            </tr>

        </table>



        <div class="pager pager-0 por">
            <a href="" class="current">1</a><a href="">2</a><a href="">3</a>
        </div>
    </div>

</div>
<!--container end-->






<!--footer start-->
<div class="footer">
    <ul class="w hz-hid">
        <li class="li-0">
            <h2>Booe.cn</h2>
            <p>以用户为中心的设计理念，专注于用户体验设计，拥有国内外最新的设计
                潮流趋势、独特而美的创意视觉、新颖而灵敏的思维意识、极致而生动的
                交互体验，更有严谨而通俗的技术教程！</p>
            <p>唯然是觉唯网的图片分享社区，以记录美丽、分享美好的创意理念，分享
                高品质创意、艺术、设计、时尚、插画、摄影、唯美类精美图片。</p>
        </li>
       <li>
           <h2>关于</h2>
           <a href="">关于Booe.cn</a>
           <a href="">留言联系</a>
           <a href="">友情链接</a>
           <a href="">免责声明</a>
           <a href="">网站地图</a>
       </li>
        <li>
            <h2>栏目</h2>
            <a href="">关于Booe.cn</a>
            <a href="">留言联系</a>
            <a href="">友情链接</a>
            <a href="">免责声明</a>
            <a href="">网站地图</a>
        </li>
        <li>
            <h2>友链</h2>
            <a href="">关于Booe.cn</a>
            <a href="">留言联系</a>
            <a href="">友情链接</a>
            <a href="">免责声明</a>
            <a href="">网站地图</a>
        </li>
        <li class="last">
            <h2>关注</h2>
            <p>Email:Booe.cn@163.com</p>
            <div class="dingyue hz-hid">
                <input type="text" value="请出入您的邮箱" onclick="if(value=='请出入您的邮箱') value=''" onblur="if(value=='') value='请出入您的邮箱'"/>
                <a href="">订阅</a>
            </div>
            <div class="link">
                <a href="" class="a-0"></a>
                <a href="" class="a-1"></a>
                <a href="" class="a-2"></a>
                <a href="" class="a-3"></a>
                <a href="" class="a-4 mr-0"></a>
            </div>
        </li>
    </ul>
    <div class="copy w">
        <span>Copyright © 2012-2015</span><a href="">booe.cn</a><span>Theme by booe.cn All All Rights Reserved. 粤ICP备12075456号-1</span>
    </div>
</div>
<!--footer end-->





</body>
</html>